<template>
  <div class="">
    <div class="warp-title word-cloud">
      <!-- <span>{{title}}</span> -->
      <!-- <img src="../images/title-icon.png" alt /> -->
      <vue-wordcloud
        style="width: 600px; height: 400px; background: #e0e1eb"
        :options="options"
      />
    </div>
  </div>
</template>
<script src="dist/vue-b2wordcloud.min.js"></script>
<script>
export default {
  // name: 'warpTitle',
  props: {
    flag: {
      type: String,
    },
  },
  components: {},
  data() {
    return {
      loading: true,
      options: {
        list: [
          ["跑步", 44],
          ["锻炼", 40],
          ["篮球", 30],
          ["足球", 32],
          ["排球", 43],
          ["乒乓球", 33],
          ["网球", 35],
          ["游泳", 31],
          ["划船", 39],
          ["深蹲", 32],
          ["举重", 36],
          ["跳远", 38],
          ["撑杆跳", 44],
          ["长跑", 31],
          ["铁人三项", 30],
          ["太极拳", 41],
          ["五禽戏", 42],
          ["有氧运动", 43],
        ],
        color: [["#122c6a", "#429CEA"], "#5DECBB", "#429CEA", "#35CCE6"],
        tooltip: {
          show: false,
        },
        backgroundColor: "#fff",
        rotationRation: [-45, 90],
        gridSize: 30,
        minFontSize: 30,
        maxFontSize: 44,
      },
    };
  },
  computed: {
    getHeigth() {
      return this.$store.state.app.getHeigth;
    },
  },
  mounted() {
  },
  methods: {},
};
</script>
